.homebox{
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.homebox-top{
  display: flex;
  justify-content: space-between;
  box-sizing: border-box;
  width: 18rem;
  height: 58%;
  padding:  0.3rem 0 ;
  margin: 0 auto;
}
.homebox-top-one{
  width: 4.7rem;
  height: 100%;
}
.homebox-top-two{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 8.15rem;
  height: 100%;
}
.homebox-top-two>div:nth-of-type(1){
  width: 100%;
  height: 0.35rem;
}
.homebox-top-two>div:nth-of-type(2){
  width: 100%;
  height: calc(100% - 0.5rem);
}
.homebox-toptwo-detail{
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  width: 100%;
  height: 100%;

}
.homebox-toptwo-detail>div:nth-of-type(1){
  width: 49%;
  height: 100%;
  /* background: url('../../assets/img/home/bgimg1.png'); */
  /* background-repeat: no-repeat; */
  /* background-size: 100% 100%; */
}
.homebox-toptwo-detail>div:nth-of-type(2){
  width: 49%;
  height: 100%;
  background: url('../../assets/img/home/bgimg1.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.homebox-top-three{
  width: 4.5rem;
}
.homebox-top-three>div:nth-of-type(1){
  width: 100%;
  height: 0.35rem;
}
.homebox-top-three>div:nth-of-type(2){
  width: 100%;
  height: calc(100% - 0.5rem);
}
.homebox-bottom{
  display: flex;
  justify-content: space-between;
  width: 18rem;
  height: 42%;
  margin: 0 auto;
}

.homebox-bottom-one{
  width: 4.7rem;
  height: 100%;
}

.homebox-bottom-two{
  width: 12.95rem;
  height: 100%;
}

.homebox-bottom-one>div:nth-of-type(1){
  width: 100%;
  height: 0.35rem;
}
.homebox-bottom-one>div:nth-of-type(2){
  width: 100%;
  height: calc(100% - 0.5rem);
}

.homebox-bottom-two>div:nth-of-type(1){
  width: 100%;
  height: 0.35rem;
}
.homebox-bottom-two>div:nth-of-type(2){
  width: 100%;
  height: calc(100% - 0.5rem);
}